<%-- 
    Document   : List
    Created on : Nov 24, 2014, 10:24:56 PM
    Author     : Java
--%>
<%@page import="jamjun.infra.web.el.*"%>
<%@page import="jamjun.infra.model.ActionType"%>
<%@page import="jsalon.resources.buttonEnum"%>
<%@page import="jsalon.resources.captionEnum"%>
<%@page import="jsalon.cls.JJDate"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<jsp:useBean id="Model" class="jsalon.web.vm.CustomerVM"  scope="session"/> 
<!DOCTYPE html>
<table id="customer-Grid" class="jq-tableGrid" style="width:90%;" maxpage="${Model.paging.totalPage}"
       currentpage="${Model.paging.pageNo}" totalitem="${Model.paging.totalItem}"
       pagesize="${Model.paging.pageSize}">
    <thead>
        <tr class="jq-hgrow">
            <th style="width:100px;">
                
            </th>
            <th style="width:100px;">
                Image
            </th>
            <th style="width:120px;">
                Code
            </th>
            <th style="width:150px;">
                Name
            </th>
            <th style="width:80px;">
                Gender
            </th>
            <th style="width:100px;">
                ID Card
            </th>
            <th style="width:80px;">
                Birth Date
            </th>
            <th style="width:100px;">
                Register Date
            </th>
            <th style="width:100px;">
                Create By
            </th>
        </tr>
    </thead>
    <tbody>
        <%
            for (jsalon.model.Customer item : Model.customerList)
            {  
        %>
        <tr id="" class="jq-bgrow">
            <td style="text-align: center;">
                <%
                ELBtnOpt opt1 = new ELBtnOpt();
                opt1.classAttr = "btnDetail";
                opt1.caption = buttonEnum.detail.getString();
                opt1.btnIcon = ELBtnIcon.search;
                opt1.onClick = "customerList_openDetailDlg";
                opt1.otherAttr=" code=\""+ item.code +"\"";
                opt1.styleAttr="width:80px; margin-bottom:5px;";
                out.println(ELHelper.jqBtn(opt1));
                %>
                <br>
                <%
                ELBtnOpt btnDel = new ELBtnOpt();
                btnDel.classAttr = "btnDelete";
                btnDel.caption = buttonEnum.delete.getString();
                btnDel.btnIcon = ELBtnIcon.delete;
                btnDel.onClick = "customerList_Delete";
                btnDel.styleAttr="width:80px;";
                btnDel.otherAttr=" code=\""+ item.code +"\"";
                btnDel.color = ELColorBtn.red;
                out.println(ELHelper.jqBtn(btnDel));
                %>
            </td>
            <td style=" text-align: center; vertical-align: central;">
                <img src="<%=item.image1 %>" style="height:80px;">
            </td>
            <td class="text">
                <%=item.code %>        
            </td>
            <td class="text">
                <%=item.name %> 
            </td>
            <td class="text">
                <%=item.gender.caption() %> 
            </td>
            <td class="text">
                <%=item.idCard %> 
            </td>
            <td>
                <%=JJDate.ConvertToStrDate(item.birthDate) %> 
            </td>
            <td>
                <%=JJDate.ConvertToStrDate(item.registerDate) %> 
            </td>
            <td class="text">
                <%=item.createBy %> 
            </td>
        </tr>
        <%} %>
    </tbody>
</table>
    
<script type="text/javascript">
    $(body).ready(function(){
        $("#customer-Grid").initialUI();
    });
    
    function customerList_openDetailDlg(holder){
        var dataSend = {"customerCode":$(holder).attr("code"),"actionType":"<%=ActionType.update.toString()%>"};
        $.fn.openDlgFrame({
            dlg: "customerList_DetailDlg",dlgID:"",titleCaption: "<%=jsalon.resources.captionEnum.titleBar_customerInfo.getString() %>",
            width: 900,height: 550,
            url: "/jSalon/customer?[ac]=detail",sendData: dataSend,
            resizable: true,Modal: true,
            autoDIV: true,
            closeOther: true,
            closeCallback: "",
            openCallback: "",
            zIndex: 999,
            disableClose : false
        });
    }
    function customerList_DetailDlg(data){
        alert("xxx");
    }
    function customerList_Delete(holder){
        var code = $(holder).attr("code");
        var data = {code:code,actionType:"<%=ActionType.delete.toString()%>"};
        $.fn.transction_DeleteData({
            URL_Save: "/jSalon/customer?[ac]=delete",           // Url สำหรับ Save
            Data: data,               // Data ที่ serialize แล้ว
            URL_SuccesReLoad: "customerList_DeleteComplete",   // Url Reload จะใส่ ID ให้เมื่อ save ผ่าน แล้ว reload กลับไปหน้าเดิม
            URL_SuccessRedirectPage: "", //Url save ผ่านแล้ว ไปไหน
            CallBackFunction: false,
            CallBackUnSeccess: "",
            titleAction:"Deleting..",
            titleActionComplete:"Delete Complete",
            messageAction: " ",
            messageActionComplete: " ",
            DialogConfirm: {
                isShow: true,
                title: "<%=jsalon.resources.alertEnum.confirm_delete.getString() %>",
                message: "<%=jsalon.resources.alertEnum.confirm_delete.getString() %>",
                width: 400,
                height: 180
            },
            confirmFunction: "DeleteDataPlugIn",
            IsShowDlgList: false
        });        
    }
    
    function customerList_DeleteComplete(data){
        customer_List();
    }
    
</script>
